﻿<!DOCTYPE html>
<html>
<head>
    <title>myDiv</title>
    <meta charset="utf-8" />
    <link type="text/css" rel="Stylesheet" href="css/myStyles.css" />
    <!--
    <link type="text/css" rel="Stylesheet" href="css/override.css" />
    <link type="text/css" rel="Stylesheet" href="css/style.css" />
    -->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>


    <!--<script src="scripts/jquery-1.7.1-vsdoc.js" type="text/javascript"></script>
    <script src="scripts/jquery-ui-1.8.18.js" type="text/javascript"></script>-->



    <script type="text/javascript" >

        $(document).ready(function () {

            var checkBoxeSpans = $('span.ch_box, span.ch_boxL');
            checkBoxeSpans.addClass('unchecked').delay(200);
            $.each(checkBoxeSpans, function () {
                $(this).click(function () {
                    if ($(this).hasClass('unchecked')) {
                        $(this).removeClass('unchecked');
                        $(this).addClass('checked');
                    } else {
                        $(this).removeClass('checked');
                        $(this).addClass('unchecked');
                    } //alert($(this).children('input').prop('checked'));
                });
            });

//            $('.scrollThumb').draggable(
//                {
//                    axis: 'y',
//                    containment: 'parent',
//                    stop: function (event, ui) {
//                        //console.log('position of Top is:' + ui.position.top);
//                        updatePos($('div.selectHolder'), ui.position.top);
//                    }
//                });

//            function updatePos(selector, valToAdd) {
//                var top = $(selector).css('top');
//                //$(selector).css('top', top += valToAdd);
//                selector[0].style.top = valToAdd + 'px';

//            }


//            var selectDivs = $('div.selectWrapper');
//            $(selectDivs).append('<div class="selectHolder">');
//            var selectHolderDivs = $('div.selectHolder');

//            $.each(selectDivs, function (selDivInd, selDiv) {

//                var selHoldDiv = $(selDiv).find('div.selectHolder');

//                var selElem = $(selDiv).find('select');
//                $.each($(selElem).children('option'), function (selInd, option) {
//                    $(selHoldDiv).append('<span class="singleOpt">' + $(option).text() + '</span>');

//                    var span1 = $(selHoldDiv).children('span.singleOpt')[selInd];
//                    $(option).height
//                    if ($(option).is(':selected')) {
//                        $(span1).addClass('selectedOption');
//                    }

//                    $(span1).on('click', function () {
//                        if ($(option).is(':selected')) {
//                            $(option).prop('selected', false);
//                            $(span1).toggleClass('selectedOption');
//                        } else {
//                            $(option).prop('selected', true);
//                            $(span1).toggleClass('selectedOption');
//                        }
//                        //alert('option selected index: ' + selInd + 'selected: ' + $(option).attr('selected'));
//                    });
//                });
//            });
            // var el = $('')
        });
              
    </script>
</head>
<body>
    <div class="targetSearch">
        <form method="post" action="index.php" name="search" style="margin-bottom: 0px">
             <input type="hidden" name="page_id" value="801" />
             <input type="hidden" name="menu_pid" value="801" />
             <input type="hidden" name="{PREFIX}cmd" value="search" />
             <input type="hidden" name="{PREFIX}start" value="" />
             <input type="hidden" name="c101_p_start" value="" />
             <input type="hidden" name="{PREFIX}region" value="" />
             <input type="hidden" name="{PREFIX}subregion" value="" />
             <input type="hidden" name="{PREFIX}EQ_reg" value="{EQ_region}" />
             <input type="hidden" name="{PREFIX}EQ_subreg" value="{EQ_subregion}" />
           <div id="search_block">
                <br />
                <span class="targetSearchHeader">Rajaa kohteiden hakua: </span>
                <br />
                <span class="targetSearchHeaderText">Vapaa sanahaku</span><br />
                <!-- <b>Vapaa sanahaku</b><br> -->
                <div id="searchField" class="textLineBaseStyle">
                    <input type="text" />
                    <span class="minibutton"><a href="JavaScript:submitSearch();">Hae</a>&nbsp;&nbsp;</span>
                    <br />
                </div>
            </div>
           <div id="flat_option">
	    <span class="search_header blueText">Asunnon Tyyppi:</span><br />
		  <span class="ch_box" ><input  class="print-clean" type="checkbox" name="{PREFIX}GRP_A_EQ_target_type[]" {GRP_A_EQ_target_type_CHECKED_1} value="1"/>Kerrostalo</span>
		  <span class="ch_box" ><input class="print-clean" type="checkbox" name="{PREFIX}GRP_A_EQ_target_type[]" {GRP_A_EQ_target_type_CHECKED_2} value="2"/>Rivitalo</span><br />
		  <span class="ch_box" ><input type="checkbox" name="{PREFIX}GRP_A_EQ_target_type[]" {GRP_A_EQ_target_type_CHECKED_3} value="3"/>OK-talo</span>
  		  <span class="ch_box" ><input type="checkbox" name="{PREFIX}GRP_A_EQ_target_type[]" {GRP_A_EQ_target_type_CHECKED_4} value="4"/>Paritalo</span><br />
		  <span class="ch_box" ><input type="checkbox" name="{PREFIX}GRP_A_EQ_target_type[]" {GRP_A_EQ_target_type_CHECKED_6} value="6"/>Erillistalo</span>
		  <span class="ch_box" ><input type="checkbox" name="{PREFIX}GRP_A_EQ_target_type[]" {GRP_A_EQ_target_type_CHECKED_8} value="8"/>Loma-asunto</span><br/>
		 <span class="ch_box_line" ><img src="img/dash_separator.png" alt="line"/></span>
	</div>
	       <div id="flat_option1">
	      <span class="search_heder blueText">Tilat</span><br />
		  <span class="ch_box" ><input type="checkbox" name="{PREFIX}EQ_balcony" {EQ_balcony_CHECKED_1} value="1" />Parveke</span>
		 
		  <span class="ch_box" ><input type="checkbox" name="{PREFIX}EQ_sauna" {EQ_sauna_CHECKED_1} value="1" />Oma sauna</span><br />
		   <span class="ch_box" ><input type="checkbox" name="{PREFIX}EQ_lift" {EQ_lift_CHECKED_1} value="1" />Hissi</span> 
		   
		    <span class="ch_box hiddenField" ><input type="checkbox" name="{PREFIX}EQ_lift" {EQ_lift_CHECKED_1} value="1" /></span><br />
		    <span class="ch_box_line" ><img src="img/dash_separator.png" alt="line"/></span><br />
		   <span class="ch_box" style="width: 230px; " ><input type="checkbox" name="{PREFIX}EQ_target_new" {EQ_target_new_CHECKED_1} value="1" />Vain uudiskohteet</span><br />
		   <span class="ch_box_line" ><img src="img/dash_separator.png" alt ="line"/></span>

		
	</div>
           <div id="flat_option2">
            <!--  S-BOX ID CHANGED TO  CLASS='S-BOX'!!!      -->
            <span class="search_heder blueText">Pinta-ala</span><br />
            
                    <div class="textBoxField textLineBaseStyle"><input class="s_box" type="text" name="{PREFIX}MIN_area_living" value="{MIN_area_living}"
                        size="9" /></div>
                             &nbsp;&nbsp;&nbsp;<b>-</b>&nbsp;&nbsp;&nbsp;&nbsp;
                         <div class="textBoxField textLineBaseStyle"><input type="text" name="{PREFIX}MAX_area_full"
                            value="{MAX_area_full}" size="9" /></div>
                    <br />
                    <span class="ch_box_line">
                        <img src="img/dash_separator.png" alt="line" /></span>
        </div>
           <div id="flat_option3">
            <span class="search_heder blueText">Hinta</span><br />
            <div class="textBoxField textLineBaseStyle"><input class="s_box" type="text" name="{PREFIX}MIN_salesprice" value="{MIN_salesprice}"
                size="9" /></div>
                    &nbsp;&nbsp;&nbsp;<b>-</b>&nbsp;&nbsp;&nbsp;&nbsp;
                <div class="textBoxField textLineBaseStyle"><input type="text" name="{PREFIX}MAX_salesprice"
                    value="{MAX_salesprice}" size="9" /></div>
            <br />
            <span class="ch_box_line">
                <img src="img/dash_separator.png" alt="line" /></span>
        </div>
           <div id="flat_option4">
            <span class="search_heder blueText">Huonelukumддrд</span><br />
            <div class="textBoxField textLineBaseStyle"><input class="s_box" type="text" name="{PREFIX}MIN_roomcount" value="{MIN_roomcount}"
                size="9" />
                </div>
                    &nbsp;&nbsp;&nbsp;<b>-</b>&nbsp;&nbsp;&nbsp;&nbsp;
                <div class="textBoxField textLineBaseStyle"><input type="text"name="{PREFIX}MAX_roomcount"
                    value="{MAX_roomcount}" size="9" /></div> <br />
            <span class="ch_box_line">
                <img src="img/dash_separator.png" alt="line" /></span>
            <script type="text/javascript">
                initForm(document.search);
            </script>
        </div>
           <div id="flat_option5" class="textBoxBaseStyle">
            <span class="search_heder blueText">Aluerajaus</span><br />
            <div class="wholesSelector">
                <div class="selectWrapper">
                    <select multiple="multiple" name="maakunta" size="8" style="width: 120px" onchange="deleteKaikki(this.form); lisaa_monta(this.form);">
                        <option value="" selected="selected">Koko maa</option>
                       <!-- <option selected="selected">222</option>
                        <option selected="selected">333</option>
                        <option>444</option>
                        <option>555</option>
                        <option>666</option>
                        <option>777</option>
                        <option>888</option>
                        <option>999</option>-->
                        <script type="text/javascript">                            document.write(areaOptions());</script>
                    </select>
                </div>
                <!--<div class="scrollparent">
                    <div class="scrollThumb" />
                </div>-->
            </div>
        </div>

        <div id="flat_option6" class="textBoxBaseStyle">
            <span class="search_heder blueText">Aluetarkennus</span><br />
            <div class="wholesSelector">
                <div class="selectWrapper">
                    <select multiple="multiple" name="sijaintikooste" size="8" style="width: 120px">
                        <option>Valitse ensin alue</option>
                    </select>
                    <!--<div class="scrollparent">
                        <div class="scrollThumb" />
                    </div>-->
                </div>
            </div>
        </div>


        <div id="flat_option7" class="inputvalue">
            <span class="search_heder blueText">Postinumero</span>
                <br />
            <div class="text_input textLineBaseStyle">
                <input type="text" name="{PREFIX}LIKE_zc" value="{LIKE_zc}" size="23" />
            </div>
                <br />
            <span class="search_heder blueText">Kaupunginosa</span><br />
            <div class="text_input textLineBaseStyle">
                <input type="text" name="{PREFIX}LIKE_ds" value="{LIKE_ds}" size="23" />
            </div>
                <br />
            <script type="text/javascript" >
		         var maakunta_options=new Array();
		         for(var i=0;i<document.search.maakunta.options.length;i++) {
	             maakunta_options[i]=document.search.maakunta.options[i];
		         }
		         function parseAreaOptions() {
	              document.search.maakunta.length=0;
		          document.search.sijaintikooste.length=0;
		          if(getValue(document.search.{PREFIX}EQ_country)=="Suomi") {
		          for(var i=0;i<maakunta_options.length;i++) {
		          document.search.maakunta.options[i]=maakunta_options[i];
		         }
		         document.search.maakunta.selectedIndex=0;
		         lisaa_monta(document.search);
	             }
		         }
		         if(document.search.{PREFIX}EQ_country&&getValue(document.search.{PREFIX}EQ_country)!="Suomi") {
		          parseAreaOptions();
		         }
            </script>
        </div>



        <br />
        <img id="phoneBigPicture" src="img/phone.png" alt="phone"" />
        <!-- 	<span id="s_text">Varaaa ilmainen<br>
	arviointi numerosta<br></span>
	<span id="s_phone">0800-155-155</span><br> -->

</form>



<!-- editointiformi loppuu -->
<script type="text/javascript">

var doc = document.search;
var prefix = "{PREFIX}";
selectRegion(doc);

function submitSearch() {
  saveRegions(doc);
  doc.{PREFIX}EQ_reg.value=doc.{PREFIX}region.value;
  doc.{PREFIX}EQ_subreg.value=doc.{PREFIX}subregion.value;
  //deleteCookie("searchtargets_tab");
  doc.submit();
}

function clearForm() {
  for (var i=0; i<doc.elements.length; i++) {
    if (doc.elements[i].name.substring(0, prefix.length)==prefix) {
      if (doc.elements[i].type=="text")
        doc.elements[i].value="";
      else if (doc.elements[i].type=="checkbox")
	doc.elements[i].checked=false;
    }
  }
  if (getValue(doc.maakunta)!="") {
    doc.{PREFIX}region.value=doc.{PREFIX}EQ_region.value="";
    doc.{PREFIX}subregion.value=doc.{PREFIX}EQ_subregion.value="";
    selectRegion(doc);
  }
}

function parseLocation(city,address,district) {
  var s="";
  if (city!=""&&city!="&nbsp;") {
    s+=(s!="")?"<br>"+city:city;
  }
  if (address!=""&&address!="&nbsp;") {
    s+=(s!="")?"<br>"+address:address;
  }
  if (district!=""&&district!="&nbsp;") {
    s+=(s!="")?"<br>"+district:district;
  }
  s=(s!="")?s:"&nbsp;"
  return s;
}

</script>
   
<!-- BEGIN no_search -->
<!-- END no_search -->

<!-- BEGIN result_count -->

<!-- END result_count -->

    </div>


</body>
</html>
